import React from 'react'
import { Form, Input, Button, DatePicker, Select } from 'antd'
import { disabledStartDate, disabledEndDate } from '../batchRecord/Search'

const FormItem = Form.Item
const { Option } = Select

const SignSearch = (props) => {
  const { getFieldDecorator } = props.form
  const { signStatusEnum, sign, status, startTime, endTime, onChangeSign, onChangeStatus, onChangeStartTime, onChangeEndTime, onSearch, onAdd } = props

  const inputLayout = { style: { width: 120 } }
  
  return (
    <Form layout="inline" style={{ padding: 24 }}>
      <FormItem label="签名名称">
        <Input {...inputLayout} value={sign} onChange={onChangeSign} placeholder="签名名称" />
      </FormItem>
      <FormItem label="状态">
        <Select {...inputLayout} value={status} style={{width: 120}} onChange={onChangeStatus}>
          <Option key="all" value={null}>全部</Option>
          {signStatusEnum.map(({ index, desc }) => <Option key={index} value={index + ''}>{desc}</Option>)} 
        </Select>
      </FormItem>
      <FormItem label="开始时间">
        <DatePicker {...inputLayout} defaultValue={startTime} onChange={onChangeStartTime} disabledDate={disabledStartDate.bind(null, endTime)} />
      </FormItem>
      <FormItem label="结束时间">
        <DatePicker {...inputLayout} defaultValue={endTime} onChange={onChangeEndTime} disabledDate={disabledEndDate.bind(null, startTime)} />
      </FormItem>
      <FormItem>
        <Button type="primary" onClick={onSearch}>查询</Button>
      </FormItem>
      <FormItem>
        <Button type="primary" onClick={onAdd}>添加</Button>
      </FormItem>
    </Form>
  )
}

export default Form.create()(SignSearch)